<template>
  <div id="headerSimple" class="headerSimple">
	  <x-header :left-options="{showBack: false}">
		  <x-icon slot="overwrite-left" type="ios-arrow-back" size="16" class="backIcon" @click="goBack"></x-icon>
		  <span slot="overwrite-left" style="color: white; font-weight: bold; font-size: 16px">{{title}}</span>
	  </x-header>
  </div>
</template>

<script>
	import bus from '@/event/eventBus'
  import { XHeader } from 'vux'

  export default {
    name: 'top',
    components: {
      XHeader
    },
	  props: ['title'],
    data () {
      return {
      }
    },
	  created: function () {
    	//let _this = this
		  /*bus.$on("setTopSimpleTitle", function (msg) {
			  _this.title = msg
		  })*/
	  },
	  methods: {
		  goBack() {
			  this.$router.go(-1)
		  }
	  }
  }
</script>

<style>

	.headerSimple > .vux-header > .vux-header-title {
		text-align: left;
		padding-left: 45px;
	}

	.vux-header {
		background-color: #44abe2 !important;
	}

	.headerSimple {
		width: 100%;
		position: fixed;
		left: 0px;
		top: 0px;
		z-index: 9999;
	}

	.backIcon {
		fill: #fff;
		position: relative;
		margin-right: 15px;
		top: 2px !important;
		left: 5px !important;
	}
</style>
